<template>
  <div id="confirm-purchase-order-page">
    <div class="page-title" :style="{top:(this.getSafeArea().top-4)+'px'}">
      <div id="back-button" @click="$router.push('/')">
        <i href="javascript:void(0)" class="el-icon-arrow-left"></i>
      </div>
      <span>采购订单确认</span>
    </div>

    <div class="product-box" style=" position: relative; overflow-x: hidden; overflow-y: auto" :style="{
      top:(this.getSafeArea().top-8+38)+'px',
    height:(this.getWinSize().height-this.getSafeArea().top-180)+'px'
    }">
      <div class="shop-info">
        <div class="shop-logo">
          <img :src="shop.logo"/>
        </div>
        <div class="shop-name" v-text="shop.name"></div>
      </div>
      <product-list-item v-for="(product,index) in productList" :key="index" :show-type="2" :curr-product="product"
                         :change-call-back="calcProductMoney"/>
      <div class="c"></div>
    </div>

    <div class="product-price-detail">
      <div class="title">金额明细</div>
      <div class="item">
        <div class="left">商品金额: </div>
        <div class="right">
          <span class="red" v-text="'￥'+ToMoney(productPrice)"></span>
        </div>
      </div>
    </div>


    <div class="page-bottom">
      <el-button type="danger" size="small" @click="submit" :disabled="submiting">确认提交</el-button>
    </div>
  </div>
</template>

<script>
import AddressItem from '../common/AddressItem'
import ProductListItem from '../common/ProductListItem'
import CartTools from '../tools/CartTools'

export default {
  name: 'ConfirmOrder',
  components: {ProductListItem, AddressItem},
  data: function () {
    return {
      shop: {
        id: 1,
        name: '',
        logo: this.NoImageUrl,
        isCollect: false,
        collectNums: 0,
        productNums: 0
      },
      productList: [],
      productPrice:0,
      submiting:false,
    }
  },
  mounted () {
    this.initData()
  },
  methods: {
    // 初始化信息
    initData: function () {
      var selectProductDataString = localStorage.getItem('selectProductData')
      var selectData = JSON.parse(selectProductDataString)
      console.log('selectData',selectData)
      this.shop = selectData.shop
      this.productList = selectData.productList
      this.calcProductMoney()
    },
    // 提交订单
    submit: function () {
      let $this = this
      var tmpList=[]
      $this.productList.forEach(function (value, index) {
        tmpList.push({
          id: value.shopProductId,
          nums: value.nums,
          name: value.name,
          model: value.model,
        })
      })
      var form={
        shopId:this.shop.id,
        productBuyNumsList:JSON.stringify(tmpList)
      }
      $this.submiting=true
      $this.MyRequest($this.ApiDoNameMember + 'Order/submitProductPurchase', form, function (orderNo) {
        $this.submiting=false
        $this.successTip('采购订单,提交成功!')
        // tmpList.forEach(function (value,index) {
        //   CartTools.delProduct(value.id,value.model)
        // })
        setTimeout(function () {
          $this.$router.push("/ShopProductPurchaseDetail?orderNo="+orderNo)
        },500)
        $this.$forceUpdate()
      }, function (msg) {
        $this.submiting=false
        $this.$message.error(msg)
      })
    },
    calcProductMoney:function () {
      let $this=this
      var productPrice=0
      $this.productList.forEach(function (product,index) {
        productPrice = (productPrice + ((product.nums * product.price).toFixed(2) - 0)).toFixed(2) - 0
      })
      $this.productPrice=productPrice;
    }
  }
}
</script>

<style scoped>

</style>
